<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>查看施工阶段计划</title>
        <link href="../img/icon.ico" rel="shortcut icon"/>
		<link rel="stylesheet" href="../layui/css/layui.css" />
        <link rel="stylesheet" href="../css/element.min.css?1" />
        <link rel="stylesheet" href="http://at.alicdn.com/t/font_2315128_5bb2ydgeqs.css">
        <link rel="stylesheet" href="../css/reset.css?3123">
        <link rel="stylesheet" href="../css/setlayui.css?12">
        <link rel="stylesheet" href="../css/viewer.min.css">
		<script src="../layui/layui.all.js"></script>
		<script type="text/javascript" src="../js/jquery.min.js"></script>
		<script type="text/javascript" src="../js/vue.min.js"></script>
        <script type="text/javascript" src="../js/element.min.js"></script>
        <script src="../js/viewer.min.js"></script>
	</head>
	<body>
        <div id="app" class="page-container" style="display: none;" v-show="showApp">
            <div class="content_box">
                <div class="cell_box" style="width: 39.25vw;">
                    <div class="cell_title">
                        <div class="cell_name">基本信息:</div>
                        <div class="cell_but"></div>
                    </div>
                    <div class="cell_cont" style="height: 200px;">
                        <div class="form_box">
                            <div class="form_name must_input">计划标题</div>
                            <div class="form_cont">
                                <el-input disabled  class="public_input" placeholder="请输入内容" v-model="basicInof.title" clearable></el-input>
                            </div>
                        </div>
                        <div class="form_box">
                            <div class="form_name must_input">预计开工完工日期</div>
                            <div class="form_cont">
                                <div class="public_input">
                                    <el-date-picker
                                        disabled 
                                        v-model="basicInof.times"
                                        type="daterange"
                                        format="yyyy-MM-dd"
                                        value-format="yyyy-MM-dd"
                                        range-separator="至"
                                        start-placeholder="开工日期"
                                        end-placeholder="完工日期">
                                    </el-date-picker>
                                </div>
                            </div>
                        </div>
                        <div class="form_box">
                            <div class="form_name must_input">所在工程节点</div>
                            <div class="form_cont">
                                <el-select class="public_input" disabled v-model="basicInof.workNodeId"  placeholder="请选择供应商">
                                    <el-option
                                        v-for="item in gcNodeList"
                                        :key="item.id"
                                        :label="item.name"
                                        :value="item.id">
                                    </el-option>
                                </el-select>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="cell_box" style="width: 43.84vw;margin-left: 2.41vw;">
                    <div class="cell_title">
                        <div class="cell_name">附件:</div>
                        <!-- <div class="cell_but">
                            <el-upload
                                class="upload-demo"
                                action="##"
                                :show-file-list="false"
                                :http-request="httprequest"
                                multiple>
                                <el-button class="border_but" type="primary">上传附件</el-button>
                            </el-upload>
                        </div> -->
                    </div>
                    <div class="cell_cont" style="height: 200px;">
                        <div class="table_box border_table_box" style="height: 100%;">
                            <el-table :data="fileList" height="100%" border style="width: 100%">
                                
                                <el-table-column prop="filename" align="center" show-overflow-tooltip label="名称"></el-table-column>
                                
                                <el-table-column prop="userName" align="center" show-overflow-tooltip label="上传人" width="70">
                                </el-table-column>
    
                                <el-table-column prop="uploadTime" align="center" show-overflow-tooltip label="上传时间" width="160">
                                </el-table-column>

                                <el-table-column align="center" show-overflow-tooltip label="操作" width="140">
                                    <template slot-scope="scope">
                                        <el-button @click="prevewImg(scope.row.filename, scope.row.fileurl)" type="text">查看</el-button>
                                        <el-button @click="downImg(scope.row.filename, scope.row.fileurl)" type="text">下载</el-button>
                                    </template>
                                </el-table-column>
                            </el-table>
                        </div>
                    </div>
                </div>
                <div class="cell_box" style="width: 100%;margin-top: 2.06vh;">
                    <div class="cell_title">
                        <div class="cell_name">计划工序进度及主体楼层:</div>
                    </div>
                    <div class="cell_cont" style="min-height: 238px;overflow: auto;max-height: 400px;">
                        <div class="list_box">
                            <div class="item_box" v-for="(item, index) in allGxList" :key="index">
                                <div class="item_select">
                                    <div style="width:66px;min-width:66px;padding-right: 10px;text-align: right;">{{(index + 1)}}.</div>
                                    <div style="width: 12.06vw;">
                                        <el-select disabled @change="processChange(item)" class="public_input" v-model="item.processId"  placeholder="请选择工序">
                                            <el-option
                                                v-for="item in subjectGxList"
                                                :key="item.id"
                                                :label="item.name"
                                                :value="item.id">
                                            </el-option>
                                        </el-select>
                                    </div>
                                    <div style="width: 22.52vw;margin-left: 10px;">
                                        <el-select disabled class="public_input" v-model="item.subProcessId"  placeholder="请选择子工序">
                                            <el-option
                                                v-for="item in item.subProcessList"
                                                :key="item.id"
                                                :label="item.name"
                                                :value="item.id">
                                            </el-option>
                                        </el-select>
                                    </div>
                                    <!-- <div style="margin-left: 10px;">
                                        <el-button @click="removeImg(allGxList, index, 1)" class="border_but" type="primary">删除</el-button>
                                    </div> -->
                                </div>
                                <div class="item_cont">
                                    <div style="width:66px;min-width:66px;padding-right: 10px;line-height: 32px;">关联主体</div>
                                    <div class="item_tab">
                                        <div class="tab_box" v-if="item.procFloorList.length > 0">
                                            <el-tabs type="card" v-model="item.tabName">
                                                <el-tab-pane :name="'x' + index2" :label="item + '号'" v-for="(item2, index2) in item.procFloorList" :key="index2">
                                                    <div slot="label" class="tab_title">
                                                        <!-- <el-checkbox v-model="item2.checked"></el-checkbox> -->
                                                        <div>{{item2.name}}</div>
                                                    </div>
                                                </el-tab-pane>
                                            </el-tabs>
                                        </div>
                                        <div class="tab_cont"  style="padding:20px;" v-show="'x' + index2 == item.tabName" v-for="(item2, index2) in item.procFloorList" :key="index2">
                                            <div class="form_box" style="width: 100%;">
                                                <div class="form_name must_input" style="width: auto;white-space: nowrap;min-width: 0;">计划施工楼层</div>
                                                <div class="form_cont" v-if="parseInt(item.processId) !== 1 && parseInt(item.processId) !== 2">
                                                    <el-select disabled multiple class="public_input" v-model="item2.floorArr"  placeholder="请选择楼层">
                                                        <el-option
                                                            v-for="item in item2.floorList"
                                                            :key="item"
                                                            :label="item + '楼'"
                                                            :value="item">
                                                        </el-option>
                                                    </el-select>
                                                </div>
                                                <div class="form_cont" v-if="parseInt(item.processId) === 1 || parseInt(item.processId) === 2">
                                                    <el-select multiple class="public_input" v-model="item2.floorArr"  placeholder="请选择楼层" disabled>
                                                        <el-option
                                                            label="1楼"
                                                            value="1">
                                                        </el-option>
                                                    </el-select>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="cell_box" style="width: 100%;margin-top: 2.06vh;">
                    <div class="cell_title">
                        <div class="cell_name">材料明细:</div>
                        <div class="cell_but">
                            <!-- <el-button @click="chioceCl" class="border_but" type="primary">新增</el-button> -->
                        </div>
                    </div>
                    <div class="cell_cont">
                        <div class="table_box border_table_box">
                            <el-table :data="clmxList" max-height="400px" ref="clmxTableRef" border style="width: 100%">
                                <el-table-column prop="materialName" align="center" show-overflow-tooltip label="名称"></el-table-column>
                                
                                <el-table-column prop="specificationName" align="center" show-overflow-tooltip label="规格"></el-table-column>
                                
                                <el-table-column prop="dosage" align="center" show-overflow-tooltip label="需用量" width="152">
                                </el-table-column>
                                
                                <el-table-column prop="unit" align="center" show-overflow-tooltip label="单位" width="70"></el-table-column>
                                
                                <el-table-column prop="useFor" align="center" show-overflow-tooltip label="使用部位" width="294">
                                </el-table-column>
                                
                            </el-table>
                        </div>
                    </div>
                </div>
            </div>
            <ul id="jq22" style="opacity: 0;height: 0;overflow: hidden;">
                <li v-for="(item, index) in previewList" :key="index"><img :src="item" /></li>
            </ul>
        </div>
        <script src="../js/FileSaver.js"></script>
		<script src="../js/public.js?12345"></script>
		<script>
			var layer = layui.layer
			var vm = new Vue({
				el: '#app',
				data() {
					return {
                        input: '',
                        value: [],
                        gcNodeList: [],
                        subjectGxList: [],
                        showApp: false,
                        projectId: '',
                        previewList: [],
                        fileList: [],
                        clmxList: [],
                        basicInof: {
                            title: '',
                            times: [],
                            workNodeId: ''
                        },
                        allGxList: [],
                        allZtList: []
					};
				},
				methods: {
                    chioceCl () {
                        var that = this
                        var selectArr = []
                        for (var i = 0; i < this.clmxList.length; i++) {
                            selectArr.push({
                                materialId: this.clmxList[i].materialId,
                                specificationId: this.clmxList[i].specificationId
                            })
                        }
                        parent.$('#publicValue').val('')
                        parent.layer.open({
                            type: 2,
                            title: '选择材料和规格',
                            shadeClose: true,
                            shade: 0.4,
                            skin: 'popup_layui',
                            area: ['52.08%', '64.81%'],
                            // area: ['91.91%', '72.16%'],
                            content: '../publicList/clmxList.html?projectId=' +  that.projectId +'&selectArr='+ encodeURIComponent(JSON.stringify(selectArr)) + '&' + new Date().getTime(),
                            end: function() {
                                setTimeout(function () {
                                    if (parent.$('#publicValue').val()) {
                                        var newList = JSON.parse(parent.$('#publicValue').val())
                                        var newArr = []
                                        for (var i = 0; i < newList.length; i++) {
                                            newArr.push({
                                                materialName: newList[i].materialName,
                                                materialId: newList[i].materialId,
                                                specificationId: newList[i].specificationId,
                                                specificationName: newList[i].specificationName,
                                                unit: newList[i].unit,
                                                dosage: 0,
                                                useFor: ''
                                            })
                                        }
                                        that.clmxList = that.clmxList.concat(newArr)
                                        that.$refs.clmxTableRef.doLayout()
                                    }
                                }, 10)
                            }
                        });
                    },
                    processChange (item) {
                        item.subProcessId = ''
                        for (var  i = 0; i < item.procFloorList.length; i++) {
                            item.procFloorList[i].floorArr = []
                        }
                        this.getchildGxData(item)
                        this.$forceUpdate()
                    },
                    addAllgx () {
                        var list = JSON.parse(JSON.stringify(this.allZtList))
                        var newarr = []
                        for (var i = 0; i < list.length; i++) {
                            var floorList = []
                            if (parseInt(list[i].downfloor) > 0) {
                                for (var j = parseInt(list[i].downfloor); j > 0; j--) {
                                    floorList.push('-' + j)
                                }
                            }
                            if (parseInt(list[i].topfloor) > 0) {
                                for (var j = 1; j < parseInt(list[i].topfloor) + 1; j++) {
                                    floorList.push(j + '')
                                }
                            }
                            newarr.push({
                                mainId: list[i].id,
                                name: list[i].name,
                                floorArr: [],
                                checked: false,
                                floorList: floorList
                            })
                        }
                        this.allGxList.push({
                            processId: '',
                            subProcessId: '',
                            tabName: 'x0', 
                            procFloorList: newarr,
                            subProcessList: []
                        })
                    },
                    cancels () {
                        var index = parent.layer.getFrameIndex(window.name); //获取窗口索引
                        parent.layer.close(index);
                    },
                    confirms () {
                        var that = this
                        if (this.basicInof.title.length == 0) {
                            this.$message({
                                message: '请输入计划标题',
                                type: 'warning',
                                duration: 1000
                            });
                            return false
                        }
                        if (this.basicInof.times.length == 0) {
                            this.$message({
                                message: '请选择预计开工完工时间',
                                type: 'warning',
                                duration: 1000
                            });
                            return false
                        }
                        if (!this.basicInof.workNodeId) {
                            this.$message({
                                message: '请选择所在工程节点',
                                type: 'warning',
                                duration: 1000
                            });
                            return false
                        }
                        if (this.allGxList.length == 0) {
                            this.$message({
                                message: '请添加计划工序进度及主体楼层',
                                type: 'warning',
                                duration: 1000
                            });
                            return false
                        }
                        var planProcList = []
                        for (var i = 0; i < this.allGxList.length; i++) {
                            var procFloorList = []
                            for (var j = 0; j < this.allGxList[i].procFloorList.length; j++) {
                                if (this.allGxList[i].procFloorList[j].checked) {
                                    procFloorList.push({
                                        mainId: this.allGxList[i].procFloorList[j].mainId,
                                        floor: this.allGxList[i].procFloorList[j].floorArr.join(',')
                                    })
                                }
                            }
                            planProcList.push({
                                processId: this.allGxList[i].processId,
                                subProcessId: this.allGxList[i].subProcessId,
                                procFloorList: procFloorList,
                            })
                        }
                        for (var i = 0; i < planProcList.length; i++) {
                            if (!planProcList[i].processId) {
                                this.$message({
                                    message: '请选择工序',
                                    type: 'warning',
                                    duration: 1000
                                });
                                return false
                            }
                            if (!planProcList[i].subProcessId) {
                                this.$message({
                                    message: '请选择子工序',
                                    type: 'warning',
                                    duration: 1000
                                });
                                return false
                            }
                            if (planProcList[i].procFloorList.length == 0) {
                                this.$message({
                                    message: '请选择关联主体',
                                    type: 'warning',
                                    duration: 1000
                                });
                                return false
                            }
                            for (var j = 0; j < planProcList[i].procFloorList.length; j++) {
                                if (!planProcList[i].procFloorList[j].floor) {
                                    this.$message({
                                        message: '请选择计划施工楼层',
                                        type: 'warning',
                                        duration: 1000
                                    });
                                    return false
                                }
                            }
                        }
                        if (this.clmxList.length == 0) {
                            this.$message({
                                message: '请添加材料明细',
                                type: 'warning',
                                duration: 1000
                            });
                            return false
                        }
                        var uploadFile = []
                        for (var i = 0; i < this.fileList.length; i++) {
                            uploadFile.push(this.fileList[i].fileid + ',' + this.fileList[i].filename + ',' + this.fileList[i].userName + ',' + this.fileList[i].uploadTime)
                        }
                        console.log(JSON.stringify({
                                title: that.basicInof.title,
                                startTime: that.basicInof.times[0],
                                endTime: that.basicInof.times[1],
                                projectId: that.projectId,
                                uploadFile: uploadFile.join('|'),
                                workNodeId: that.basicInof.workNodeId,
                                planMatList: that.clmxList,
                                planProcList: planProcList,
                                id: that.recid
                            }))
                        xLoading(true, '正在提交')
                        $.ajax({
                            type: 'post',
                            headers: {
                                'Content-Type': 'application/json'
                            },
                            url: baseUrl + '/ConstructionPlan/EditConstructionPlan',
                            data: JSON.stringify({
                                title: that.basicInof.title,
                                startTime: that.basicInof.times[0],
                                endTime: that.basicInof.times[1],
                                projectId: that.projectId,
                                uploadFile: uploadFile.join('|'),
                                workNodeId: that.basicInof.workNodeId,
                                planMatList: that.clmxList,
                                planProcList: planProcList,
                                id: that.recid
                            }),
                            dataType: 'json',
                            success: function(res) {
                                xLoading(false)
                                if (!res.success) {
                                    that.$message({
                                        message: res.msg ? res.msg : '程序错误，请重试',
                                        type: 'error'
                                    });
                                    return false;
                                }
                                that.$message({
                                    message: '已提交',
                                    type: 'success'
                                });
                                setTimeout(function () {
                                    var index = parent.layer.getFrameIndex(window.name); //获取窗口索引
                                    parent.layer.close(index);
                                }, 500)
                            }
                        });
                    },
                    httprequest (file) {
                        var that = this
                        xLoading(true, '正在上传')
                        var formData = new FormData();
						formData.append('files', file.file);
						$.ajax({
							type: 'post',
							url: baseUrl + '/Common/UploadFile?method=UploadFile&type=OSS',
							data: formData,
							dataType: 'json',
							contentType: false,
							processData: false,
							success: function(res) {
                                xLoading(false)
								if (!res.success) {
									that.$message({
										message: res.msg,
										type: 'error'
									});
									return false;
                                }
                                var newobj = {
                                    fileid: res.data.fileId,
                                    filename: res.data.fileName,
                                    fileurl: res.data.ossUrl,
                                    uploadTime: res.data.uploadTime,
                                    userName: res.data.userName
                                }
                                that.fileList.push(newobj)
							}
						});
                    },
                    prevewImg (filename, urls) {
                        if (getFileType(filename) == 'IMG') {
                            this.previewList = [urls];
                            setTimeout(function () {
                                var viewer = new Viewer(document.getElementById('jq22'), {
                                    hide: function () {
                                        viewer.destroy();
                                    }
                                });
                                viewer.show();
                            }, 10);
                            return false
                        }
                        if (getFileType(filename) == 'PDF') {
                            parent.layer.open({
                                type: 2,
                                title: 'pdf预览',
                                shadeClose: true,
                                shade: 0.8,
                                area: ['98%', '98%'],
                                content: '../pdf/web/viewer.html?file=' + encodeURIComponent(urls),
                                end: function () { }
                            });
                            return false
                        }
                        publicdownFile(filename, urls)
                    },
                    downImg (filename, urls) {
                        publicdownFile(filename, urls)
                    },
                    removeImg (arr, index, types) {
                        var title = '此操作将永久删除该文件, 是否继续?'
                        if (types == 1) {
                            title = '此操作将永久删除该数据, 是否继续?'
                        }
                        this.$confirm(title, '提示', {
                            confirmButtonText: '确定',
                            cancelButtonText: '取消',
                            type: 'warning'
                        }).then(function () {
                            arr.splice(index, 1)
                        }).catch(function () {
                        });
                    },
                    getGcNode () {
                        var that = this
                        xLoading(true)
                        $.ajax({
                            type: 'post',
                            headers: {
			                    'Content-Type': 'application/json'
                            },
                            url: baseUrl + '/Common/GetWorkNode',
                            data: {},
                            dataType: 'json',
                            success: function(res) {
                                xLoading(false)
                                if (!res.success) {
                                    that.$message({
                                        message: res.msg ? res.msg : '程序错误，请重试',
                                        type: 'error'
                                    });
                                    return false;
                                }
                                that.gcNodeList = res.data
                            }
                        });
                    },
                    getsubjectGxData () {
                        var that = this
                        xLoading(true)
                        $.ajax({
                            type: 'post',
                            headers: {
			                    'Content-Type': 'application/json'
                            },
                            url: baseUrl + '/Common/GetProcessList',
                            data: {},
                            dataType: 'json',
                            success: function(res) {
                                xLoading(false)
                                if (!res.success) {
                                    that.$message({
                                        message: res.msg ? res.msg : '程序错误，请重试',
                                        type: 'error'
                                    });
                                    return false;
                                }
                                that.subjectGxList = res.data
                                that.getDetailData()
                            }
                        });
                    },
                    getchildGxData (item) {
                        var that = this
                        xLoading(true)
                        $.ajax({
                            type: 'post',
                            headers: {
			                    'Content-Type': 'application/json'
                            },
                            url: baseUrl + '/Common/GetSubProcessList',
                            data: JSON.stringify({
                                id: item.processId
                            }),
                            dataType: 'json',
                            success: function(res) {
                                xLoading(false)
                                if (!res.success) {
                                    that.$message({
                                        message: res.msg ? res.msg : '程序错误，请重试',
                                        type: 'error'
                                    });
                                    return false;
                                }
                                item.subProcessList = res.data
                                that.$forceUpdate()
                            }
                        });
                    },
                    getGcztData () {
                        var that = this
                        xLoading(true)
                        $.ajax({
                            type: 'post',
                            headers: {
			                    'Content-Type': 'application/json'
                            },
                            url: baseUrl + '/Common/GetProjectMainList',
                            data: JSON.stringify({
                                projectId: that.projectId
                            }),
                            dataType: 'json',
                            success: function(res) {
                                xLoading(false)
                                if (!res.success) {
                                    that.$message({
                                        message: res.msg ? res.msg : '程序错误，请重试',
                                        type: 'error'
                                    });
                                    return false;
                                }
                                that.getsubjectGxData()
                                that.allZtList = res.data
                                // console.log(that.allZtList);
                            }
                        });
                    },
                    getDetailData () {
                        var that = this
                        xLoading(true)
                        $.ajax({
                            type: 'post',
                            headers: {
			                    'Content-Type': 'application/json'
                            },
                            url: baseUrl + '/ConstructionPlan/GetConstructionPlan',
                            data: JSON.stringify({
                                id: that.recid
                            }),
                            dataType: 'json',
                            success: function(res) {
                                
                                xLoading(false)
                                if (!res.success) {
                                    that.$message({
                                        message: res.msg ? res.msg : '程序错误，请重试',
                                        type: 'error'
                                    });
                                    return false;
                                }
                                that.basicInof = {
                                    title: res.data.title,
                                    times: [res.data.startTime, res.data.endTime],
                                    workNodeId: res.data.workNodeId
                                }
                                var allGxList = []
                                var list = JSON.parse(JSON.stringify(that.allZtList))
                                // 处理关联主体列表
                                var newarr = []
                                for (var i = 0; i < list.length; i++) {
                                    var floorList = []
                                    if (parseInt(list[i].downfloor) > 0) {
                                        for (var j = parseInt(list[i].downfloor); j > 0; j--) {
                                            floorList.push('-' + j)
                                        }
                                    }
                                    if (parseInt(list[i].topfloor) > 0) {
                                        for (var j = 1; j < parseInt(list[i].topfloor) + 1; j++) {
                                            floorList.push(j + '')
                                        }
                                    }
                                    newarr.push({
                                        mainId: list[i].id,
                                        name: list[i].name,
                                        floorArr: [],
                                        checked: false,
                                        floorList: floorList
                                    })
                                }
                               
                                // 处理 计划工序进度及主体楼层 

                                // procFloorList 计划的关联主体 进行处理 mainId关联主体的id 以及选中的楼层
                                for (var i = 0; i < res.data.planProcList.length; i++) {
                                    var arr = JSON.parse(JSON.stringify(newarr))
                                    for (var j = 0; j < res.data.planProcList[i].procFloorList.length; j++) {
                                        for (var k = 0; k < arr.length; k++) {
                                            
                                            if (res.data.planProcList[i].procFloorList[j].mainId == arr[k].mainId) {
                                                
                                                arr[k].checked = true
                                                arr[k].id = res.data.planProcList[i].procFloorList[j].id
                                                arr[k].floorArr = res.data.planProcList[i].procFloorList[j].floor.split(',')
                                            }
                                        }
                                    }
                                    allGxList.push({
                                        processId: res.data.planProcList[i].processId,
                                        subProcessId: res.data.planProcList[i].subProcessId,
                                        tabName: 'x0',
                                        procFloorList: arr,
                                        id: res.data.planProcList[i].id,
                                        subProcessList: []
                                    })
                                }
                                for (var i = 0; i < allGxList.length; i++) {
                                    that.getchildGxData(allGxList[i])
                                }
                                that.allGxList = allGxList
                                
                                that.clmxList = res.data.planMatList
                                if (res.data.uploadFile.length > 0) {
                                    for (var i = 0; i < res.data.uploadFile.split('|').length; i++) {
                                        that.fileList.push({
                                            fileid: res.data.uploadFile.split('|')[i].split(',')[0],
                                            filename: res.data.uploadFile.split('|')[i].split(',')[1],
                                            fileurl: baseUrl + '/DataInput/FileService?method=DownloadFile&fileid=' + res.data.uploadFile.split('|')[i].split(',')[0],
                                            uploadTime: res.data.uploadFile.split('|')[i].split(',')[3],
                                            userName: res.data.uploadFile.split('|')[i].split(',')[2],
                                        })
                                    }
                                }
                            }
                        });
                    }
				},
				mounted() {
                    this.showApp = true;
                    this.projectId = getQuerys('projectId')
                    // this.projectId = "G000077";
                    this.recid = getQuerys('recid')
                    // this.recid = "101";
                    this.getGcNode()
                    this.getGcztData()
                    // getQuerys()
				}
			});
		</script>
	</body>
	<style>
		.content_box {
            padding: 0 2.08vw 2.06vh;
            overflow: auto;
            height: calc(100% - 50px);
        }
        .cell_box {
            float: left;
        }
        .cell_title {
            display: flex;
            align-items: center;
            padding: 10px 0;
            height: 52px;
        }
        .cell_but {
            padding-left: 10px;
        }
        .cell_cont {
            border: 1px solid #EBEBEB;
            padding: 3.09vh 2.08vw;
        }
        .public_input .el-date-editor {
            width: 100%;
        }
        .public_input .el-date-editor .el-range__icon {
            line-height: 24px;
        }
        .public_input .el-range-separator {
            width: auto;
            line-height: 24px;
        }
        .public_input .el-date-editor .el-range__close-icon {
            line-height: 24px;
        }
        .form_box {
            display: flex;
            align-items: center;
            margin-bottom: 20px;
        }
        .form_name {
            min-width: 132px;
            padding-right: 10px;
            text-align: right;
        }
        .form_cont {
            flex: 1;
        }
        .item_cont {
            display: flex;
            margin-top: 20px;
        }
        .item_tab {
            width: calc(100% - 66px);
        }
        .tab_box {
            height: 32px;
        }
        .tab_box .el-tabs__header {
            margin: 0;
        }
        .tab_box .el-tabs__item {
            height: 32px;
            line-height: 32px;
        }
        .tab_cont {
            min-height: 94px;
            border: 1px solid #EBEBEB;
        }
        .item_select {
            display: flex;
            align-items: center;
        }
        .item_box {
            width: calc((100% - 30px) / 2);
            margin-bottom: 20px;
        }
        .list_box {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-between;
        }
        .tab_box .el-tabs__nav-next, .tab_box .el-tabs__nav-prev {
            line-height: 32px;
            width: 20px;
            display: flex;
            align-items: center;
            justify-content: center;
            height: 32px;
            border-top: 1px solid #E4E7ED;
        }
        .tab_box .el-tabs__nav-next {
            border-right: 1px solid #E4E7ED;
        }
        .tab_box .el-tabs__nav-prev {
            border-left: 1px solid #E4E7ED;
        }
        .tab_box .el-tabs__nav-next::after {
            content: '';
            display: block;
            position: absolute;
            left: -1px;
            top: 0;
            width: 1px;
            height: 100%;
            background: #E4E7ED;
        }
        .tab_box .el-tabs--card>.el-tabs__header .el-tabs__nav {
            border-radius: 0;
        }
        .tab_box .el-tabs__nav-scroll {
            position: relative;
        }
        .tab_box .el-tabs__nav-scroll::before {
            content: '';
            display: block;
            position: absolute;
            left: 0;
            top: 0;
            width: 1px;
            height: 100%;
            background: #E4E7ED;
        }
        .tab_box .el-tabs__item.is-active {
            position: relative;
        }
        .tab_box .el-tabs__item.is-active::before {
            content: '';
            display: block;
            position: absolute;
            left: 0;
            top: 0;
            width: 100%;
            height: 2px;
            background: #5574D7;
        }
        .tab_title {
            display: flex;
            align-items: center;
        }
        .table_nums .el-input-number{
            width: 100%;
            height: 24px;
            line-height: 24px;
        }
        .table_nums .el-input-number__decrease, .table_nums .el-input-number__increase {
            height: 22px;
            width: 24px;
            background: #fff;
        }
        .table_nums .el-input__inner {
            height: 24px;
            text-align: center;
            line-height: 24px;
            padding: 0 24px;
        }
        .el-input.is-disabled .el-input__inner {
            color: #333333;
        }
        .el-range-editor.is-disabled input {
            color: #333333;
        }
	</style>
</html>
